<template>
  <view>
    <view v-if="!isShow">
      <web-view
        :src="h5Url"
        :webview-styles="{ top: webWTop, height: webWHeight }"
        ref="webview"
      ></web-view>
    </view>
    <!--联系客服-->
    <u-popup :show="isShow" mode="center" :round="22">
      <view class="w-72 py-5">
        <view class="mx-6">
          <view class="flex justify-center items-center">
            <u-icon name="warning-fill" color="#FF4949"></u-icon>
            <view class="text-sm font-bold leading-10 ml-2"
              >网络异常，请联系客服</view
            >
          </view>
          <view
            class="rounded-full text-white text-center h-10 leading-10 text-sm mt-5 mb-3"
            style="background: #ffa829"
            @click="goTo('im-login')"
            >联系客服</view
          >
        </view>
      </view>
    </u-popup>
  </view>
</template>

<script>
export default {
  data() {
    return {
      isShow: false,
      h5Url: '',
      webWTop: uni.getSystemInfoSync().statusBarHeight,
      webWHeight:
        uni.getSystemInfoSync().screenHeight -
        uni.getSystemInfoSync().statusBarHeight,
    };
  },
  onLoad() {
    // 通道线路自动选择
    this.entranceTab(process.env.VUE_APP_ENTRANCE, 1);
    var _this = this;
    plus.key.addEventListener('backbutton', () => {
      let pages = getCurrentPages();
      let page = pages[pages.length - 1];
      if (page.$getAppWebview().children()[0]) {
        page.$getAppWebview().children()[0].evalJS('window.myHistory()');
      } else {
        this.$Router.back();
      }
      alert('BackButton Key pressed!');
    });
    uni.onKeyboardHeightChange((res) => {
      if (res) {
        let message = `msgHeight(${JSON.stringify(res.height)})`;
        let pages = getCurrentPages();
        let page = pages[pages.length - 1];
        page.$getAppWebview().children()[0].evalJS(message);
      }
    });
  },
  onUnload() {
    uni.offKeyboardHeightChange();
  },
  methods: {
    //路由跳转
    goTo(url) {
      this.$Router.push({
        name: url,
      });
    },
    // 通道线路自动选择 => 默认进入第一通道，当第一通道无法访问就选第二通道，以此类推。
    async entranceTab(entrance, type) {
      let _this = this;
      uni.request({
        url: entrance,
        success: function (res) {
          // 请求成功，说明已连接外网 => 此路能通
          _this.h5Url =
            entrance +
            '?Version=' +
            uni.getStorageSync('Version' + process.env.VUE_APP_PLATFORMID) +
            '&Brand=' +
            uni.getSystemInfoSync().deviceBrand;
        },
        fail: function (res) {
          //console.log(res, type);
          if (type == 2) {
            //线路不通时弹窗显示联系在线客服入口
            _this.isShow = true;
          } else if (type == 1) {
            // 请求失败，说明未连接外网 => 此路不通，走另一条路
            return _this.entranceTab(process.env.VUE_APP_ENTRANCE2, 2);
          }
          //else if (type == 2) {
          // 请求失败，说明未连接外网 => 此路不通，走另一条路
          //return _this.entranceTab(process.env.VUE_APP_ENTRANCE3, 3);
          //}
        },
      });
    },
  },
};
</script>

<style></style>
